<%
/**
 * multiSelect 外部调用的系统菜单多选弹出对话框
 * 
 * @author  李荣华
 * @version v1.0
 * @date    2017-12-23
 * @since   JSP 2.3.1
 */
%>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="at" uri="http://www.jketing.com/at"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>功能多选</title>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
	<meta content="no-cache" http-equiv="Pragma"/>
	<meta content="no-cache" http-equiv="Cache-Control"/>
	<meta content="0" http-equiv="Expires"/>
	<meta name="GENERATOR" content="MSHTML 8.00.6001.18854"/>
	<link rel="stylesheet" id="dialog" type="text/css" href="<at:url css="dialog.css"/>" />	
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/scripts/common/zTree/zTreeStyle/zTreeStyle.css" />
	<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/jquery.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/common.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/common/zTree/jquery.ztree.all.min.js"></script>
	<script type="text/javascript" src="<at:url js="dialog.js"/>"></script>
    <script type="text/JavaScript">
    
	    var MyObject = window.dialogArguments;
		
		//取功能键数据
		function getFunList(id){
			$.getJSON("${pageContext.request.contextPath}/function/getSubTree?id="+id,function(data){
		   		temptbody = document.getElementById("funList");
		   		//删除表中原有内容
		   		while(temptbody.hasChildNodes()){
					temptbody.removeChild(temptbody.lastChild);
				}
				//遍历JSON中的每个entry 			
				$.each(data,function(entryIndex,entry){ 
					if("3"==entry['type']){
						tempInput=document.createElement("input");
						tempInput.name = "selectAll";
					    tempInput.type="checkbox";
					    tempInput.value=entry['id'];
					    functionObString="selected(this);";
						tempInput.onclick=new Function("",functionObString);
						//tempInput.thetext=entry['name'];		
						tempInput.setAttribute("theText",entry['name']);//设置自定义属性theText
						tempnobr=document.createElement("nobr");	
						tempnobr.appendChild(tempInput);
					    textNode = document.createTextNode(entry['name']);
					    tempnobr.appendChild(textNode);
					    temptbody.appendChild(tempnobr);
					    tempbr=document.createElement("br");
					    temptbody.appendChild(tempbr);		
					}
				}); 
			});
		}
	    
	    function okClick() 
	    {
	        var SelectedList=document.getElementById("SelectedList");
		    if ( SelectedList.options.length > 0 ) 
		    {
			    MyObject.pWindow.funBreakcall(SelectedList);
			    close();    
		    }
	        else
	        {  
	            alert('你没有选择！');
	        }
	    }
	    
	    function doCancel()
	    {
	        window.close();
	    }
	    
	    function init()
	    {
	        if(MyObject.idValues!=""){
	        	var idList = MyObject.idValues.split(",");
	        	var nameList = MyObject.nameValues.split(",");	
	        	var lis=document.getElementById("SelectedList");	
				for(i=0;i<idList.length;i++){
					lis.options.length=lis.options.length+1;
				    lis.options[lis.options.length-1].text = nameList[i];
				    lis.options[lis.options.length-1].value = idList[i];
				}
	        }
	    }
	    
	    var zTree;
		var zNodes = eval('(' + '${funTree}' + ')');
		var setting = {
				data: {
					simpleData: {
						enable: true,
						idKey: "id",
						pIdKey: "pId"
					}
				},
				async: {
					enable: true,
					type:"get",
					url: "${pageContext.request.contextPath}/function/getSubTree",
					autoParam: ["id"]
				},
				callback: {
					onClick: zTreeOnClick
				}
			};
		
		function refreshTree() {
			//zTree = $("#tree").zTree(setting, zNodes);
			$.fn.zTree.init($("#tree"), setting, zNodes);
			zTree = $.fn.zTree.getZTreeObj("tree");
		}
		
		function zTreeOnClick(event, treeId, treeNode) {
			if("2"==treeNode.type){
				getFunList(treeNode.id);
			}
		}
		
		function zTreeOnAsyncError(event, treeId, treeNode, XMLHttpRequest, textStatus, errorThrown) {
			alert("error");
		}
		
		$(document).ready(function(){
			refreshTree();	
			init();			
		});    
    </script>
	<base target="_self"/>
</head>
<body>
<form action="">
	<div class="dialog_mutil1">
    	<div class="ele_tree">
	        <div class="ele_tree_con"><ul id="tree" class="ztree"></ul></div>
	    </div>
	     <div class="ele_checkbox">
	    	<div class="checkbox_title"><span onclick="selectReverse('selectAll');">全选/多选</span></div>
	        <div class="checkbox_body" id="funList">
	        </div>
	    </div>
	    <div class="arrow2">
	    	<div class="arrow_top" onclick="moveUp(document.all.SelectedList);"></div>
	        <div class="arrow_middle" onclick="removeAll(document.all.SelectedList);"></div>
	        <div class="arrow_bottom" onclick="moveDown(document.all.SelectedList);"></div>
	    </div>
	    <div class="select_lump2">
	    	<div class="select_title">已选功能</div>
	        <div>
	            <select multiple="multiple" id="SelectedList" ondblclick="removeSelect(this);" size="5" style="width: 130px; height: 377px;margin:0px;padding:0px;">               
	            </select>
	        </div>
	    </div>
	    <div class="clear_div"></div>
	    <div class="dialog_button dialog_button3">
	    	<div class="button_left button_left3" onclick="okClick();">确定</div>
	    	<div class="button_right button_right3" onclick="doCancel();">取消</div>
	  	</div>
    </div>
</form>
</body>
</html>
